@import '@style/layout.less';
@import '@style/grid.less';
@import '@style/effect.less';
@import '@style/font.less';
@import '@style/color.less';
@import '@style/border.less';

body {
    margin: 0;
    overflow-y: hidden;
}

.app {
    display: flex;
    justify-content: center;
    background-attachment: fixed;
}

.app__aside {
    height: 100vh;
    overflow-y: auto;
    padding-top: 10px;
    width: 200px;
}

.app__main {
    height: 100vh;
    scroll-behavior: smooth;
    overflow-y: auto;
}

.intro__container {
    .wdu-box();

    header {
        padding: 20px 20px 0 20px;
    }

    .intro__intro {
        .wdu-text-paragraph();
        margin: 12px;
    }

    .intro__main {
        padding: 0 20px 20px 20px;

        .intro__main--items {
            flex-grow: 1;
            margin: 20px 0;

            .intro__cpnt {
                display: flex;
                justify-content: center;
                align-items: center;
            }

            .intro__info {
                .wdu-text-normal();
                text-align: center;
            }
        }

        .intro__block {
            padding: 0;
            margin: 20px 0;
        }

        &-sub {
            flex-grow: 1;
            margin-bottom: 25px;
        }
    }

    .intro__code {
        width: 100%;
        border-top: 1px solid #dedede;

        .intro__code--title {
            margin: 0;
            display: flex;
            justify-content: center;
            cursor: pointer;
            padding: 15px 0;
        }
    }
}
